﻿<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册 - 社交媒体平台</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="auth-container">
        <div class="auth-box">
            <h2>注册账号</h2>
            <form id="registerForm" class="auth-form">
                <div class="form-group">
                    <label for="username">用户名</label>
                    <input type="text" id="username" required>
                </div>
                <div class="form-group">
                    <label for="email">邮箱</label>
                    <input type="email" id="email" required>
                </div>
                <div class="form-group">
                    <label for="password">密码</label>
                    <input type="password" id="password" required>
                </div>
                <button type="submit" class="auth-btn">注册</button>
            </form>
            <p class="auth-link">
                已有账号？<a href="login.html">立即登录</a>
            </p>
        </div>
    </div>
    <script type="module">
        import { api } from './api.js';

        document.getElementById('registerForm').addEventListener('submit', async (e) => {
            e.preventDefault();

            try {
                const username = document.getElementById('username').value;
                const email = document.getElementById('email').value;
                const password = document.getElementById('password').value;

                await api.register(username, email, password);
                window.location.href = '/';
            } catch (error) {
                alert(error.message);
            }
        });
    </script>
</body>
</html> 